import React, { useRef } from 'react';
import { useSewTask } from 'dw-mx-sew';
import { Button, Col, Form, Input, Row } from 'dw-mx';

export default function UTC1Demo() {
    const [form] = Form.useForm();
    const sef2OnCompleteTask = useRef();
    // 流程任务
    const sewTask = useSewTask();

    // 流程驱动事件监听
    const doExecuteMethodDescribInBPMN = async () => {
        return true;
    };
    const chk_preGoPrevious = async () => {
        return true;
    };
    const configCU = async () => {
        return true;
    };
    const configDDS = async () => {
        return true;
    };
    const configGlobal = async () => {
        return true;
    };
    const configMachine = async () => {
        return true;
    };
    const goAbort = async () => {
        return true;
    };
    const goNext = async () => {
        return true;
    };
    //注册事件
    sewTask.registerEventListeners({
        doExecuteMethodDescribInBPMN,
        chk_preGoPrevious,
        configCU,
        configDDS,
        configGlobal,
        configMachine,
        goAbort,
        goNext,
    });
    // 获取流程变量
    const processVars = sewTask.getProcessVars();
    // console.log(processVars.getPiid(), 'getPiid');
    // console.log(processVars.getTid(), 'getTid');
    // console.log(processVars.getEid(), 'getEid');
    // console.log(processVars.getProperty, 'getProperty');

    // 暂时定义的flowpath，用来让utc驱动流程
    const fnid = 'btn_goNext';

    const onCompleteTask = async () => {
        return fnid;
    };

    // 触发点击事件，将oncompleteTask注册到UTP上
    const onclick = () => {
        sewTask.registerCompleteTask({
            onCompleteTask,
        });
    };

    // UI
    const layout = {
        labelCol: { span: 6 },
        wrapperCol: { span: 18 },
    };
    return (
        <>
            <Form form={form} {...layout} layout={'horizontal'}>
                <Row>
                    <Col span={8}>
                        <Form.Item label="piid" name="piid" rules={[{ required: true }]}>
                            <Input placeholder={'piid'} maxLength={10} />
                        </Form.Item>
                    </Col>
                    <Col span={8}>
                        <Form.Item label="eid" name="eid" rules={[{ required: true }]}>
                            <Input placeholder={'eid'} maxLength={10} />
                        </Form.Item>
                    </Col>
                    <Col span={8}>
                        <Form.Item label="tid" name="tid" rules={[{ required: true }]}>
                            <Input placeholder={'tid'} maxLength={10} />
                        </Form.Item>
                    </Col>
                </Row>
                <Row>
                    <Col span={8}>
                        <Form.Item label="tname" name="tname" rules={[{ required: true }]}>
                            <Input placeholder={'tname'} maxLength={10} />
                        </Form.Item>
                    </Col>
                    <Col span={8}>
                        <Form.Item label="tctime" name="tctime" rules={[{ required: true }]}>
                            <Input placeholder={'tctime'} maxLength={10} />
                        </Form.Item>
                    </Col>
                    <Col span={8}>
                        <Form.Item label="bljgid" name="bljgid" rules={[{ required: true }]}>
                            {/* <Input placeholder={'bljgid'} maxLength={10} /> */}
                            <Button onClick={onclick}>UTC驱动流程按钮</Button>
                        </Form.Item>
                    </Col>
                </Row>
            </Form>
        </>
    );
}
